<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0, user-scalable=no" name="viewport" />
    <meta content="yes" name=" apple-mobile-web-app-capable" />
    <meta content="no" name="apple-touch-fullscreen" />
    <meta content="black" name=" apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection"/>
    <title></title>
    <script src="../js/base.min.js"></script>
    <link rel="stylesheet" href="../css/sy.css"/>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_961432_szz2vx8mhrs.css"/>
</head>
<body>
<!--1层-->
<div class="banner">
    <div class="d1">
        <input type="text"placeholder="点击输入你想要的内容"/>
        <i class="iconfont icon-sousuo" id="ss">
        </i>
        <i class="iconfont icon-kefu"id="kf">
        </i>
    </div>
   <div class="dd1">
       <ul  class="dd12"flex>
           <li class="l1" flex="main:center dir:top cross:center">
               <img src="..//img/1.png" />
               <p>
                   刷卡收款
               </p>
           </li>
           <li class="l1" flex="main:center dir:top cross:center">
               <img src="..//img/2.png" />
               <p>
                   无卡支付
               </p>
           </li>
           <li class="l1" flex="main:center dir:top cross:center">
               <img src="..//img/3.png" />
               <p>
                   附近商圈
               </p>
           </li>
           <li class="l1" flex="main:center dir:top cross:center">
               <img src="../img/4.png" />
               <p>
                   还信用卡
               </p>
           </li>
       </ul>
   </div>
</div>

<!--2-->
<div class="dd2" >
    <ul class="dd21" flex>
        <li class="dd211"  flex="cross:center main:center dir:top">
            <i class="iconfont icon-youhuiquan"  >
            </i>
            <p>优惠券
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-wode_tuijianyouli" >
            </i>
            <p>推荐有礼
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-shangcheng1" >
            </i>
            <p>我的商城
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-43" id="l24">
            </i>
            <p>惠买单
            </p>
        </li>
    </ul>
    <ul class="dd21 ll2" flex>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-qiahao"id="l25" >
            </i>
            <p>推荐办卡
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-licaishouyi"id="l26" >
            </i>
            <p>金融理财
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-jisukuikuan"id="l27" >
            </i>
            <p>极速贷款
            </p>
        </li>
        <li class="dd211" flex="cross:center main:center dir:top">
            <i class="iconfont icon-shenqingdan" id="l28">
            </i>
            <p>信用卡申请
            </p>
        </li>
    </ul>
</div>
<!--3-->
<div class="dd3">
    <img  src="..//img/1-2.jpg"/>
</div>
<!--4-->
<div class="dd4">
    <div class="dd41"flex="cross:center">
        <div class="xr"flex="main:left cross:center">
            <span>收支明细</span>
        </div>
    </div>
    <div class="dd42" flex="main:center cross:center">
        <div class="dd421" flex="main:center cross:center dir:top">
            <div class="dd4211">
                <span class="s1">¥</span>
                <span class="s2">168.5</span>
                <span class="s3">万</span>
            </div>
            <div class="dd4212">本月收款金额</div>
        </div>
        <div class="dx"></div>
        <div class="dd422" flex="main:center cross:center dir:top">
            <div class="dd4221 ">
                <span class="s1">¥</span>
                <span class="s2">16.05</span>
                <span class="s3">元</span>
            </div>
            <div class="dd4212">本月支出金额</div>
        </div>
    </div>
</div>
<!--5-->
<div class="dd5">
    <button type="button">查看详细账单</button>
</div>
<!--6-->
<div class="foot" flex>
   <div class="dd6" flex="main:center cross:center dir:top">
       <i class="iconfont icon-shouye"></i>
       <p>首页</p>
   </div>
    <div class="dd6" flex="main:center cross:center dir:top">
        <i class="iconfont icon-licaihover"></i>
        <p>理财</p>
    </div>
    <div class="dd6" flex="main:center cross:center dir:top">
        <i class="iconfont icon-icon"></i>
        <div class="ff1"></div>
        <p>消息</p>
    </div>
    <div class="dd6" flex="main:center cross:center dir:top">
        <i class="iconfont icon-wode"></i>
        <p>我的</p>
    </div>
</div>

</body>
</html>